<!DOCTYPE html>
<html lang="zh-CN">
  <head>
    <title>{$title}</title>
    <meta charset="utf-8"/>
    <meta name="viewport" content="user-scalable=no, width=device-width, initial-scale=1, maximum-scale=1" />
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <meta name="apple-touch-fullscreen" content="yes" />
		<meta name="apple-mobile-web-app-capable" content="yes" />
		<!-- 删除苹果默认的工具栏和菜单栏 -->
		<meta name="apple-mobile-web-app-status-bar-style" content="black" />
		<!-- 设置苹果工具栏颜色 -->
		<meta name="format-detection" content="telphone=no, email=no" />
		<!-- 忽略页面中的数字识别为电话，忽略email识别 -->
		<meta name="renderer" content="webkit" />
		<!-- 启用360浏览器的极速模式(webkit) -->
		<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
		<!-- 避免IE使用兼容模式 -->
		<meta name="HandheldFriendly" content="true" />
		<!-- 针对手持设备优化，主要是针对一些老的不识别viewport的浏览器，比如黑莓 -->
		<meta name="MobileOptimized" content="480" />
		<!-- 微软的老式浏览器 -->
		<meta name="screen-orientation" content="portrait" />
		<!-- uc强制竖屏 -->
		<meta name="x5-orientation" content="portrait" />
		<!-- QQ强制竖屏 -->
		<meta name="format-detection" content="telephone=no" />
		<!-- 去除苹果浏览器自带link -->
    <script src="https://cdn.bootcss.com/jquery/2.2.1/jquery.min.js"></script>
    <script src="https://cdn.bootcss.com/Cookies.js/1.2.1/cookies.js"></script>
    <script src="https://cdn.bootcss.com/OwlCarousel2/2.2.0/owl.carousel.min.js"></script>
    <link rel="dns-prefetch" href="https://wepay.weipinchu.com/" />
    <link rel="stylesheet" href="https://ommdq027l.qnssl.com/static/release/1494780595539/vendor.css" />
    <link rel="stylesheet" href="https://ommdq027l.qnssl.com/static/release/1494780595539/front.css" />
	<link href="https://at.alicdn.com/t/font_fsk2otdio7ds4i.css" rel="stylesheet">    
    <link href="https://at.alicdn.com/t/font_apds0v8n2bhp8pvi.css" rel="stylesheet">	
    <style>
    	@media only screen and (min-width: 300px) {
    		.novel-image{
    			width: 45%;
    			float: left;
    		}
    		.novel-info{
    			float: left;
    			width: 55%;
    		}
    		.novel-item{
    			clear: both;
    		}
    	}
    <literal>
      body,html{-webkit-tap-highlight-color:transparent}body{overflow-x:hidden;background-color:#fbf9fe}.container{height:100%;overflow-y:auto;-webkit-overflow-scrolling:touch}.container>div{background-color:#fbf9fe}.hd{padding:1.5em 0}.page_title{text-align:center;font-size:24px;color:#3cc51f;font-weight:400;margin:0 15%}.page_desc{text-align:center;color:#888;font-size:14px}.bd.spacing{padding:0 15px}.home{padding-bottom:30px}.button .page_title{color:#225fba}.button .bd{padding:0 15px}.button .button_sp_area{padding:10px 0;width:60%;margin:0 auto;text-align:justify;text-justify:distribute-all-lines;font-size:0}.button .button_sp_area:after{display:inline-block;width:100%;height:0;font-size:0;margin:0;padding:0;overflow:hidden;content:"."}.cell .page_title{color:#225fba}.cell .bd{padding-bottom:30px}.dialog .bd,.toast .bd{padding:120px 15px 0}.msg{background-color:#fff}.panel .bd{padding-bottom:20px}.article{background-color:#fff}.article .page_title{color:#de7c23}.icons{background-color:#fff;text-align:center}.icons .page_title{color:#3e24bd}.icons .bd{padding:30px 0;text-align:center}.icons .icon_sp_area{padding:10px 20px;text-align:left}.icons i{margin:0 5px 10px}.tabbar{height:100%}.search_show{display:none;margin-top:0;font-size:14px}.search_show .weui_cell_bd{padding:2px 0 2px 20px;color:#666}.icon{display:inline-block;width:28px;height:28px;vertical-align:middle}.icon_button{background:url(images/icon_nav_button.png) no-repeat;background-size:28px 28px}.icon_cell{background:url(images/icon_nav_cell.png) no-repeat;background-size:28px 28px}.icon_toast{background:url(images/icon_nav_toast.png) no-repeat;background-size:28px 28px}.icon_dialog{background:url(images/icon_nav_dialog.png) no-repeat;background-size:28px 28px}.icon_progress{background:url(images/icon_nav_progress.png) no-repeat;background-size:28px 28px}.icon_msg{background:url(images/icon_nav_msg.png) no-repeat;background-size:28px 28px}.icon_article{background:url(images/icon_nav_article.png) no-repeat;background-size:28px 28px}.icon_actionSheet{background:url(images/icon_nav_actionSheet.png) no-repeat;background-size:28px 28px}.icon_icons{background:url(images/icon_nav_icons.png) no-repeat;background-size:28px 28px}.icon_panel{background:url(images/icon_nav_panel.png) no-repeat;background-size:28px 28px}.icon_tab{background:url(images/icon_nav_tab.png) no-repeat;background-size:28px 28px}.icon_search_bar{background:url(images/icon_nav_search_bar.png) no-repeat;background-size:28px 28px}@-webkit-keyframes a{0%{-webkit-transform:translate3d(100%,0,0);transform:translate3d(100%,0,0);opacity:0}to{-webkit-transform:translateZ(0);transform:translateZ(0);opacity:1}}@keyframes a{0%{-webkit-transform:translate3d(100%,0,0);transform:translate3d(100%,0,0);opacity:0}to{-webkit-transform:translateZ(0);transform:translateZ(0);opacity:1}}@-webkit-keyframes b{0%{-webkit-transform:translateZ(0);transform:translateZ(0);opacity:1}to{-webkit-transform:translate3d(100%,0,0);transform:translate3d(100%,0,0);opacity:0}}@keyframes b{0%{-webkit-transform:translateZ(0);transform:translateZ(0);opacity:1}to{-webkit-transform:translate3d(100%,0,0);transform:translate3d(100%,0,0);opacity:0}}.enter,.leave{position:absolute;top:0;right:0;bottom:0;left:0;z-index:1}.enter{-webkit-animation:a .2s forwards;animation:a .2s forwards}.leave{-webkit-animation:b .25s forwards;animation:b .25s forwards}
    </literal>
    </style>
  </head>
  <body class=" has-footer-nav">
  	<input type="hidden" name="class_id" id="class_id" value="{$class_id}" />
  	<input type="hidden" name="other_class_id" id="other_class_id" value="{$other_class_id}" />
  	<input type="hidden" name="is_order" id="is_order" value="{$is_order}" />
  	<input type="hidden" name="is_free" id="is_free" value="{$is_free}" />
    <include file="Public/menu"/>
    <div class="novel-list" id="novel-list">
</div>
<div class="weui-infinite-scroll">
  <div class="infinite-preloader"></div>
</div>

<script>
  $(function () {
    var loading = false;    
    var cursor = 0;
    var limit = 10;
    var completed = false;
    var class_id = $("#class_id").val();
    var other_class_id = $("#other_class_id").val();
    var is_order = $("#is_order").val();
    var is_free = $("#is_free").val();
    if(is_free)
    	var apiurl = '/Home/Novel/ajaxGetFreeNovelList';
    else
    	var apiurl = '/Home/Novel/ajaxGetNovelList?class_id='+class_id+"&other_class_id="+other_class_id+"&is_order="+is_order;
    

    loadList(cursor);

    $(document.body).infinite(50).on('infinite', function () {
      if (loading || completed) {
        return false;
      }

      loadList(cursor);
    });

    function loadList(start) {
      loading = true;

      return $.get(apiurl, {start: start, limit: limit}, function (entries) {
        var htmls = [];
		var entries_count = 0;
        $.each(entries, function () {
          var entry = this;
          var url = '/Home/Novel/novelinfo/id/' + entry.id;
          if(entry.is_free == 1)
          	var free_time_str = '<div class="novel-meta"><span style="color:darkorange"><i class="iconfont icon-clock" style="vertical-align: middle"></i> <span style="vertical-align:middle">限时免费 :'+entry.start_time+' ~ '+entry.end_time+'</span></span></div>';
          else
        	var free_time_str = ''; 
          htmls.push(
	              '<div class="novel-item">' +
	                '<div class="novel-image">' +
	                  '<a href="' + url + '"><img src="{:C('FILE_HOST_PATH')}' + entry.avatar + '" onerror="this.src=\'/Public/attached/other/img_error.jpg\'"/></a>' +
	                '</div>' +
	                '<div class="novel-info">' +
	                  '<a href="' + url + '" class="novel-title">' + entry.title + '</a>' +
	                  free_time_str + 
	                  '<div class="novel-summary"><a href="' + url + '">' + entry.summary + '</a></div>' +
	                '</div>' +
	              '</div>'
	          );
		  entries_count++;
        });

        $('#novel-list').append(htmls.join(''));

        cursor = cursor + entries_count;
        completed = entries.length < limit;

        loading = false;

        if (completed) {
          $(document.body).destroyInfinite();
          $('.weui-infinite-scroll').remove();
        }
      });
    }
  });
</script>
    <script src="https://cdn.bootcss.com/jquery-weui/0.8.2/js/jquery-weui.min.js"></script>
</body>
</html>
